import 'package:flutter/material.dart';

class FlexExpanded1 extends StatelessWidget {
  const FlexExpanded1({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(),
        body: Flex(
          direction: Axis.horizontal,
          children: [
            Expanded(
                flex: 1,
                child: Container(
                    width: 100,
                    height: 100,
                    alignment: Alignment.center,
                    decoration: BoxDecoration(
                        border: Border.all(
                            color: const Color.fromRGBO(233, 233, 233, 0.9),
                            width: 1),
                        color: Colors.grey),
                    child: Text('1',
                        textAlign: TextAlign.center,
                        overflow: TextOverflow.ellipsis, //超出省略号显示
                        style: const TextStyle(fontSize: 14)
                    )
                )
            ),
            Expanded(
                flex: 2,
                child: Container(
                    width: 100,
                    height: 100,
                    alignment: Alignment.center,
                    decoration: BoxDecoration(
                        border: Border.all(
                            color: const Color.fromRGBO(233, 233, 233, 0.9),
                            width: 1),
                        color: Colors.grey),
                    child: Text('1',
                        textAlign: TextAlign.center,
                        overflow: TextOverflow.ellipsis, //超出省略号显示
                        style: const TextStyle(fontSize: 14))))
          ],
        ),
      ),
    );
  }
}

class FlexExpanded2 extends StatelessWidget {
  const FlexExpanded2({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(),
        body: Container(
          child: ListView(
            children: [
              SizedBox(
                height: 200,
                width: double.maxFinite,
                child: Image.network(
                  'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fsafe-img.xhscdn.com%2Fbw1%2F2458134e-d968-4ba0-8893-be439dd091d4%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fsafe-img.xhscdn.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1705070960&t=83f5e44492af04cacb9a579f89912ecf',
                  fit: BoxFit.cover,
                ),
              ),
              SizedBox(height: 2),
              Container(
                height: 200,
                child: Row(
                  children: [
                    Expanded(
                      flex: 2,
                      child: Image.network(
                        'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fsafe-img.xhscdn.com%2Fbw1%2F2458134e-d968-4ba0-8893-be439dd091d4%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fsafe-img.xhscdn.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1705070960&t=83f5e44492af04cacb9a579f89912ecf',
                        fit: BoxFit.cover,
                      ),
                    ),
                    SizedBox(width: 2),
                    Expanded(
                        flex: 1,
                        child: SizedBox(
                          height: 200,
                          width: double.maxFinite,
                          child: Column(
                            children: [
                              Expanded(
                                flex: 1,
                                child: Container(
                                  width: double.maxFinite,
                                  child: Image.network(
                                    'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fsafe-img.xhscdn.com%2Fbw1%2F2458134e-d968-4ba0-8893-be439dd091d4%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fsafe-img.xhscdn.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1705070960&t=83f5e44492af04cacb9a579f89912ecf',
                                    fit: BoxFit.cover,
                                  ),
                                ),
                              ),
                              SizedBox(height: 2),
                              Expanded(
                                flex: 1,
                                child: Container(
                                    width: double.maxFinite,
                                    child: Image.network(
                                      'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fsafe-img.xhscdn.com%2Fbw1%2F2458134e-d968-4ba0-8893-be439dd091d4%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fsafe-img.xhscdn.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1705070960&t=83f5e44492af04cacb9a579f89912ecf',
                                      fit: BoxFit.cover,
                                    )),
                              ),
                            ],
                          ),
                        ))
                  ],
                ),
              )
            ],
          ),
        ),
      ),
    );
  }
}
